import 'package:flutter/material.dart';
import 'package:flutter_changdian_football/pages/clubs/club_info/club_info_controller.dart';
import 'package:flutter_changdian_football/widget/custom_button.dart';
import 'package:flutter_changdian_football/widget/default_page/custom_empty.dart';
import 'package:flutter_changdian_football/widget/dialog/club_avatar_dialog.dart';
import 'package:flutter_changdian_football/widget/dialog/featured_avatars_dialog.dart';
import 'package:flutter_changdian_football/widget/load_state/load_state_layout.dart';
import 'package:flutter_changdian_football/widget/screenutil/custom_screenutil.dart';
import 'package:flutter_changdian_football/widget/sheet/address_picker.dart';
import 'package:flutter_changdian_football/widget/sheet/param_picker.dart';
import 'package:flutter_pickers/address_picker/locations_data.dart';
import 'package:get/get.dart';

/// 俱乐部信息
class ClubInfoPage extends StatelessWidget {
  const ClubInfoPage({super.key, this.clubId});

  final String? clubId;

  @override
  Widget build(BuildContext context) {
    return GetBuilder<ClubInfoController>(
      init: ClubInfoController(clubId: clubId),
      builder: (clubInfoController) {
        return LoadStateLayout(
          state: clubInfoController.state,
          loading: Scaffold(
            backgroundColor: const Color(0xffF8FAF9),
            appBar: AppBar(
              centerTitle: true,
              backgroundColor: const Color(0xffF8FAF9),
              elevation: 0,
              title: Text(
                '俱乐部信息',
                style: TextStyle(fontSize: 16.sp, color: const Color(0xff333333)),
              ),
              iconTheme: const IconThemeData(
                color: const Color(0xff333333)
              ),
            ),
            body: Center(
              child: CircularProgressIndicator(
                color: const Color(0xff499360),
                strokeWidth: 4.w,
              )
            )
          ),
          empty: Scaffold(
            backgroundColor: const Color(0xffF8FAF9),
            appBar: AppBar(
              centerTitle: true,
              backgroundColor: const Color(0xffF8FAF9),
              elevation: 0,
              title: Text(
                '俱乐部信息',
                style: TextStyle(fontSize: 16.sp, color: const Color(0xff333333)),
              ),
              iconTheme: const IconThemeData(
                color: Color(0xff333333)
              ),
            ),
            body: const Center(
              child: CustomEmpty(
                text: '暂无俱乐部信息',
              ),
            )
          ),
          success: Scaffold(
            backgroundColor: const Color(0xffF8FAF9),
            appBar: AppBar(
              centerTitle: true,
              backgroundColor: const Color(0xffF8FAF9),
              elevation: 0,
              title: Text(
                '俱乐部信息',
                style: TextStyle(fontSize: 16.sp, color: const Color(0xff333333)),
              ),
              iconTheme: const IconThemeData(
                color: Color(0xff333333)
              ),
            ),
            bottomNavigationBar: Container(
              padding: EdgeInsets.symmetric(horizontal: 17.w, vertical: 8.w),
              width: double.infinity,
              child: Column(
                mainAxisSize: MainAxisSize.min,
                children: [
                  CustomButton(
                      text: '修改俱乐部',
                      onTap: () {
                        clubInfoController.updateClub();
                      },
                    )
                ],
              ),
            ),
            body: Column(
              children: [
                Expanded(
                  child: SingleChildScrollView(
                    padding: EdgeInsets.symmetric(horizontal: 17.w),
                    physics: const BouncingScrollPhysics(),
                    child: Center(
                      child: Column(
                        children: [
                          SizedBox(height: 64.w,),
                    
                          Stack(
                            clipBehavior: Clip.none,
                            alignment: Alignment.center,
                            children: [
                              Container(
                                width: double.infinity,
                                height: 150.w,
                                decoration: BoxDecoration(
                                  color: Colors.white,
                                  borderRadius: BorderRadius.circular(12.r)
                                ),
                                padding: EdgeInsets.only(bottom: 12.w),
                                child: Row(
                                  crossAxisAlignment: CrossAxisAlignment.end,
                                  mainAxisAlignment: MainAxisAlignment.spaceAround,
                                  children: [
                                    _topAndBottomWidget(text: '竞技强度', value: '${clubInfoController.clubDetailModel?.clubSportsName ?? '-'}'),
                                    _topAndBottomWidget(text: '活跃度', value: '${clubInfoController.clubDetailModel?.liveness ?? '0'}'),
                                    _topAndBottomWidget(text: '人数', value: '${clubInfoController.clubDetailModel?.playerNum ?? '0'}'),
                                    _topAndBottomWidget(text: '比赛场次', value: '${clubInfoController.clubDetailModel?.matchCount ?? '0'}'),
                                  ],
                                ),
                              ),
        
                              Positioned(
                                top: -40.w,
                                child: GestureDetector(
                                  behavior: HitTestBehavior.translucent,
                                  onTap: () {
                                    ClubAvatarDialog.show(
                                      Get.context!,
                                      isRecommend: true,
                                      proposeTap: () {
                                        Get.back();
                                        FeaturedAvatarsDialog.show(
                                          Get.context!,
                                          defaultClubAvatarList: clubInfoController.defaultClubAvatarList,
                                          confirmTap: (v) {
                                            clubInfoController.clubDetailModel?.clubImage = v;
                                            clubInfoController.update();
                                            Get.back();
                                          },
                                        );
                                      },
                                      phoneTap: () {
                                        clubInfoController.photoSelectImage();
                                      },
                                      shootTap: () {
                                        clubInfoController.shootSelectImage();
                                      },
                                    );
                                  },
                                  child: Column(
                                    children: [
                                      Container(
                                        width: 88.w,
                                        height: 88.w,
                                        decoration: BoxDecoration(
                                          borderRadius: BorderRadius.circular(10.r),
                                          color: Colors.white,
                                          border: Border.all(
                                            width: 2.w,
                                            color: Colors.white
                                          ),
                                          boxShadow: const [
                BoxShadow(
                  color: Color.fromRGBO(0, 0, 0, 0.0800),
                  offset: Offset(0, 2),
                  blurRadius: 4,
                ),
              ],
                                        ),
                                        child: ClipRRect(
                                          borderRadius: BorderRadius.circular(10.r),
                                          child: Image.network(clubInfoController.clubDetailModel?.clubImage ?? '', fit: BoxFit.fill,)
                                        ),
                                      ),
                                        
                                      SizedBox(height: 5.w,),
                                        
                                      SizedBox(
                                        child: Text(clubInfoController.clubDetailModel?.clubName ?? '', style: TextStyle(fontSize: 16.sp, color: const Color(0xff333333), fontWeight: FontWeight.bold),),
                                      )
                                    ],
                                  ),
                                )
                              )
                            ],
                          ),
        
                          SizedBox(height: 16.w,),
        
                          Container(
                            width: double.infinity,
                            decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular(12.r),
                              color: Colors.white
                            ),
                            padding: EdgeInsets.symmetric(horizontal: 12.w),
                            child: Column(
                              children: [
                                _leftAndRightWidget(leftText: '创始日期', rightText: '${clubInfoController.clubDetailModel?.clubCreateTime}', isRight: false),
                                Container(
                                  width: double.infinity,
                                  height: 1.w,
                                  color: const Color(0xffF8FAF9),
                                ),
                                _leftAndRightWidget(leftText: '俱乐部名称', rightText: '${clubInfoController.clubDetailModel?.clubName}', isRight: false),
                                Container(
                                  width: double.infinity,
                                  height: 1.w,
                                  color: const Color(0xffF8FAF9),
                                ),
                                _leftAndRightWidget(leftText: '俱乐部所在地', rightText: '${clubInfoController.clubDetailModel?.clubAddress}', onTap: () {
                                  AddressPicker.show(
                                    context,
                                    initProvince: clubInfoController.province1 ?? '',
                                    initCity: clubInfoController.city1 ?? '',
                                    onConfirm: (province, city, district) {
                                      clubInfoController.changeAddress(province, city, district);
                                    }
                                  );
                                }),
                                Container(
                                  width: double.infinity,
                                  height: 1.w,
                                  color: const Color(0xffF8FAF9),
                                ),
                                _leftAndRightWidget(leftText: '活动主场', rightText: '${clubInfoController.clubDetailModel?.clubHomeCourtName}', onTap: () {
                                  ParamPicker.show(
                                    '活动主场', 
                                    context, 
                                    clubInfoController.courtStrList,
                                    selecteds: clubInfoController.selectCourtIndex,
                                    onConfirm: (v) {
                                      clubInfoController.changeSelectCourtIndex(v);
                                    }
                                  );
                                }),
                                Container(
                                  width: double.infinity,
                                  height: 1.w,
                                  color: const Color(0xffF8FAF9),
                                ),
                                _leftAndRightWidget(leftText: '竞技强度', rightText: '${clubInfoController.clubDetailModel?.clubSportsName}', onTap: () {
                                  ParamPicker.show(
                                    '竞技强度', 
                                    context, 
                                    clubInfoController.jjqdStrList,
                                    selecteds: clubInfoController.selectJjqdIndex,
                                    onConfirm: (v) {
                                      clubInfoController.changeSelectJjqdIndex(v);
                                    }
                                  );
                                })
                              ],
                            ),
                          ),
        
                          SizedBox(height: 16.w,),
        
                          Container(
                            width: double.infinity,
                            decoration: BoxDecoration(
                              borderRadius: BorderRadius.circular(12.r),
                              color: Colors.white
                            ),
                            padding: EdgeInsets.symmetric(vertical: 12.w, horizontal: 12.w),
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                SizedBox(
                                  child: Text('俱乐部简介', style: TextStyle(fontSize: 15.sp, color: const Color(0xff323232)),),
                                ),
        
                                SizedBox(height: 12.w,),
        
                                Container(
                                  height: 80.w,
                                  width: double.infinity,
                                  decoration: BoxDecoration(
                                    color: Colors.white,
                                    borderRadius: BorderRadius.circular(12.r),
                                  ),
                                  child: Column(
                                    children: [
                                      Expanded(
                                        child: TextField(
                                          keyboardType: TextInputType.text,
                                          maxLines: 5,
                                          maxLength: 255,
                                          controller: clubInfoController.profileController,
                                          decoration: InputDecoration(
                                            contentPadding: EdgeInsets.zero,
                                            border: const OutlineInputBorder(
                                              borderSide: BorderSide.none,
                                            ),
                                            hintStyle: TextStyle(fontSize: 14.sp, color: const Color(0xff9E9E9E)),
                                            hintText: '请输入俱乐部简介',
                                            counterText: '',
                                          ),
                                          style: TextStyle(fontSize: 14.sp, color: const Color(0xff333333)),
                                          onChanged: (v) {
                                          },
                                        ),
                                      )
                                    ],
                                  ),
                                ),
                              ],
                            ),
                          )
                        ],
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
        );
      }
    );
  }


  _topAndBottomWidget({
    String value = '',
    String text = ''
  }) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.end,
      children: [
        Text(
          value,
          style: TextStyle(fontSize: 18.sp, color: const Color(0xff499360), fontWeight: FontWeight.w500),
        ),
        SizedBox(height: 3.w,),
        Text(
          text,
          style: TextStyle(fontSize: 12.sp, color: const Color(0xff999999)),
        ),
      ],
    );
  }


  _leftAndRightWidget({
    String leftText = '',
    String rightText = '',
    bool isRight = true,
    Function? onTap
  }) {
    return GestureDetector(
      behavior: HitTestBehavior.translucent,
      onTap: () {
        onTap?.call();
      },
      child: Container(
        padding: EdgeInsets.symmetric(vertical: 15.w),
        child: Row(
          children: [
            SizedBox(
              child: Text(leftText, style: TextStyle(fontSize: 15.sp, color: const Color(0xff323232)),),
            ),
    
            const Spacer(),
    
            SizedBox(
              child: Text(rightText, style: TextStyle(fontSize: 14.sp, color: const Color(0xff999999), height: 1.5),),
            ),
    
            if (isRight) ...[
              SizedBox(width: 8.w,),
    
              Container(
                margin: EdgeInsets.only(top: 1.w),
                width: 10.w,
                height: 10.w,
                child: Image.asset('assets/images/icon_arrow_grey_right.png'),
              )
            ],
          ],
        ),
      ),
    );
  }

}